const List = ({pokemonsList}) => {
  const imgCss = {
    border: '1px solid darkorange',
    borderRadius: '10px',
  }
  return (
    <ul className='ul-container'>
      {
        pokemonsList.map((pokemon) => {
            return (
              <div key={pokemon.url}>
                <li>{pokemon.name}</li>
                <img src={
                  `https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/${ pokemon.id }.png`
                } style={imgCss}/>
              </div>
            )
          }
        )
      }
    </ul>
  )
}

// export default List